<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
	<html>

	<head>
		<meta charset="utf-8">
		<title>我的公益活动</title>
		<link href="css/myui.css" rel="stylesheet" />
		<link rel="stylesheet" href="css/mui.min.css">
		<link rel="stylesheet" href="css/myui.css">
		<style type="text/css">
			html,body{
				background: #fff;	
			}
			.mui-table-view:after,.mui-table-view:before{
				height: 0;
			}
			.mui-table-view{
				margin: 0;
			}
			.mui-table-view li{
				border: 0;
				padding: 0 !important;
				border-radius: 0;
				margin-top: 0rem;
				box-shadow: inherit;
				border-bottom: 1px solid #c8c7cc;
			}
			.mui-navigate-right:after, .mui-push-right:after{
				content: '';
			}
			.mui-table-view>li>a{
				float: left;
				width: 7rem;
				height: 3.5rem;
			}
			.mui-table-view>li>a img{
				width: 100%;
				height: 100%;
			}
			.wh_content{
				padding: 0.5rem 1rem;
				height: auto;
				position: relative;
    			overflow: hidden;
    			border-bottom: 1px solid #c8c7cc;
			}
			.wh_content2{
				border-bottom: 0px !important;
			}
			.wh_content .wh_content1 {
			    width: 10%;
			    height: 1.8rem;
			    margin-top: 0;
			    padding: 0;
			}
			.wh_content .wh_content2 {
			    width: 85%;
			    margin-left: 5%;
			    line-height: 1.9rem;
			    font-size: 1rem;
			    padding-bottom: 0;
			    border-bottom: 1px solid #cbc6cd;
			}
			.wh_content .wh_content2>img {
			    margin-top: 0.65rem;
			}
			.wh_mypublic_content_block{
				display: block;
			}
			.wh_mypublic_content_title_left{
				float: left;
			    width: 30%;
			    height: 6rem;
			    padding: 0.2rem;
			    background: #f0f2f5;
			    border: 1px solid #c8c7cc;
			}
			.wh_mypublic_content_title>div>img{
				width: 100%;
				height: 100%;
			}
			.wh_mypublic_content_title{
				position: relative;
				overflow: hidden;
			}
			.wh_mypublic_content_title_right{
				float: right;
				width: 70%;
			    height: 6rem;
			    padding-top: 5%;
			    padding-left: 3%;
			}
			.wh_mypublic_content_title_right>p{
				font-size: 0.7rem;
			}
			.mui-table-view-cell:after{
				height: 0;
			}
			/*.mui-table-view{
				margin-top: 3rem;
			}*/
			.deg_90 {
			    transform: rotate(90deg);
			    -webkit-transform: rotate(90deg);
			}
			.wh_mypublic_content {
			    position: relative;
			    overflow: hidden;
			    padding: 0.5rem 1rem;
			}
			.wh_content .wh_content1 img {
			    width: 100%;
			    height: 100%;
			}
		</style>
		<script src="js/mui.min.js"></script>
		<script type="text/javascript" src="js/jquery-1.9.0.js"></script>
		<script type="text/javascript" charset="utf-8">
			mui.init();
		</script>
	</head>

	<body>

		<div id="app" class="mui-views" data-view="1">
			<div class="mui-view">
				<div class="mui-navbar">
					<div class="mui-navbar-inner mui-bar mui-bar-nav mui-navbar-center">
						<button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left mui-pull-left_style">
							<span class="mui-icon mui-icon-left-nav"></span>
						</button>
						<h1 class="mui-center mui-title mui-title_fff" style="margin-left: -15px;">我的公益活动</h1>
					</div>
				</div>
				<div class="mui-pages">
					<div id="setting" class="mui-page mui-page-center">
			<!--页面主内容区结束-->
					</div>
				</div>
			</div>
		</div>
		
		<!--主要内容-->
		<div id="pullrefresh" class="mui-content mui-scroll-wrapper wh_lawyer_list_content">
			<div class="mui-scroll wh_lawyer_list_nav">
				<!--数据列表-->
				<ul class="mui-table-view mui-table-view-chevron">
				</ul>
			</div>
		</div>

	</body>

	<script src="js/index.js"></script>
	<script type="text/javascript">
		mui('.reservation_content').scroll();
		$(".my_welfare_content:nth-child(1) .my_welfare_content1_additional").show();
		$(".my_welfare_content").click(function(){
			if($(this).is(".welfare_content_is")){
				$(".my_welfare_content").removeClass("welfare_content_is");
				$(this).children(".my_welfare_content1_additional").hide();
				$(this).children(".my_welfare_content1").children(".my_welfare_content1_right").children().attr("src","img/right_jiantou.png");
			}else{
				$(".my_welfare_content").removeClass("welfare_content_is");
				$(this).addClass("welfare_content_is");
				$(".my_welfare_content").children(".my_welfare_content1").children(".my_welfare_content1_right").children().attr("src","img/right_jiantou.png");
				$(this).children(".my_welfare_content1").children(".my_welfare_content1_right").children().attr("src","img/right_jiantou2.png");
				$(this).children(".my_welfare_content1").children(".my_welfare_content1_right").addClass("my_welfare_content1_right_jiantou");
				$(".my_welfare_content1_additional").hide();
				$(this).children(".my_welfare_content1_additional").show();
			}
		});
		var phoneNum = "";
		mui.init({
			pullRefresh: {
				container: '#pullrefresh',
				up: {
					contentrefresh: '正在加载...',
					callback: pullupRefresh
				}
			}
		});

		mui.plusReady(function() {
			phoneNum = localStorage.getItem("phoneNum");
			if (phoneNum == "" || phoneNum == null) {
				mui.toast("请先登录！");
				location.href = "login.html";
			}
		})

		var count = 0;
		/**
		 * 上拉加载具体业务实现
		 */
		function pullupRefresh() {
			setTimeout(function() {
				mui('#pullrefresh').pullRefresh().endPullupToRefresh(false); //参数为true代表没有更多数据了。
				var url = get_url()+'signUp/list/'+phoneNum;
				var table = document.body.querySelector('.mui-table-view');
				var count_length = 10;
				var count_json;
				$.ajax({
					method: "post",
					url: url,
					data: {
						"pageIndex": count,
						"pageSize": count_length,
						"userType": 'lawyer'
					},
					dataType: 'JSON', //加入这个选项即可
					success: function(json){
						console.log(json);
						count++;
						if(json == null	|| json == ""){
							mui('#pullrefresh').pullRefresh().endPullupToRefresh(true);
							$(".mui-pull-bottom-pocket").css("visibility","inherit");
							return count;
						}
						for (var i = 0; i < json.length; i++) {
							var imgPath = "http://101.201.42.91:8083"+json[i].imgPath;
							var ID = json[i].ID;
							var li = document.createElement('li');
							li.innerHTML = "<div class='wh_content' >"
												+"<div class='wh_content1'><img src='img/ax.png'></div>"
												+"<div class='wh_content2'>"
													+"<span>"+ json[i].ACTIVITYNAME +"</span>"
													+"<img src='img/more.png'>"
												+"</div>"
											+"</div>"
											+"<div class='wh_mypublic_content' style='display: none;'>"
												+"<div class='wh_mypublic_content_title'>"
													+"<div class='wh_mypublic_content_title_left' id='imgF"+i+"'><img src='"+ imgPath +"'></div>"
													+"<div class='wh_mypublic_content_title_right'>"
														+"<p style='color: #4d4d4d;'><span style='font-weight: 600;'>主题：</span>"+ json[i].ACTIVITYNAME +"</p>"
														+"<p style='color: #0693ef;' data-gps='location.html?lon="+json[i].LONGITUDE+"&lat="+json[i].LATITUDE+"'><span style='color: #4d4d4d;font-weight: 600;'>地点：</span>"+ json[i].LOCATIONADDR +"</p>"
														+"<p style='color: #0693ef;'><span style='color: #4d4d4d;font-weight: 600;'>人数：</span>"+ json[i].PLAYERS +"</p>"
														+"<p style='color: #0693ef;'><span style='color: #4d4d4d;font-weight: 600;'>日期：</span>"+json[i].CREATETIME+"</p>"
													+"</div>"
												+"</div>"
												+"<p style='color: #4d4d4d;text-align: center;padding: 0.5rem 0rem;font-size: 0.8rem;'><span style='font-weight: 600;'>我要说：</span>"+ json[i].NOTE +"</p>"
											+"</div>";
							count_json = li;
							table.appendChild(li);
							var DomMui = count_json.children[1].children[0].children[1].children[1];
							DomMui.addEventListener('tap', function(){
								mui.openWindow({
								    url: $(this).data('gps'),
								    id: 'location.html',
								    createNew:false,//是否重复创建同样id的webview，默认为false:不重复创建，直接显示
								    waiting:{
								      autoShow:true,//自动显示等待框，默认为true
								      title:'正在加载...',//等待对话框上显示的提示内容
								    }
								});
							})
						}
						var DomMui = count_json.parentNode;
						var Dchlil = DomMui.children;
						for(var i = 0; i < Dchlil.length; i++){
							var Dch = Dchlil[i];
							Dch.addEventListener('tap', function(e){
								if(!$(this).is(".is_dommui_lis")){
									$(this).addClass("is_dommui_lis");
									$(this).children(".wh_mypublic_content").show();
									$(this).children(".wh_content").children(".wh_content2").children("img").addClass("deg_90");
								}else{
									$(this).removeClass("is_dommui_lis");
									$(this).children(".wh_mypublic_content").hide();
									$(this).children(".wh_content").children(".wh_content2").children("img").removeClass("deg_90");
								}
							});
						}
						
					},
					error: function(jqXHR, textStatus, errorThrown) {
						mui.plusReady(function(){
							document.addEventListener("netchange", wainshow, false);
							wainshow();
							//message();
						});
						function wainshow() {
							if (plus.networkinfo.getCurrentType() == plus.networkinfo.CONNECTION_NONE) {
							mui.toast("网络异常，请检查网络设置！");				
							} else {
							//mui.toast("网络正常");
							}
						}
					}
				});
			},1500);
		}
		if (mui.os.plus) {
			mui.plusReady(function() {
				setTimeout(function() {
					mui('#pullrefresh').pullRefresh().pullupLoading();
				}, 1000);

			});
		} else {
			mui.ready(function() {
				mui('#pullrefresh').pullRefresh().pullupLoading();
			});
		}
			
		var view = viewApi.view;
		(function($) {
			//处理view的后退与webview后退
			var oldBack = $.back;
			$.back = function() {
				if (viewApi.canBack()) { //如果view可以后退，则执行view的后退
					viewApi.back();
				} else { //执行webview后退
					oldBack();
				}
			};
			//监听页面切换事件方案1,通过view元素监听所有页面切换事件，目前提供pageBeforeShow|pageShow|pageBeforeBack|pageBack四种事件(before事件为动画开始前触发)
			//第一个参数为事件名称，第二个参数为事件回调，其中e.detail.page为当前页面的html对象
			view.addEventListener('pageBeforeShow', function(e) {
				//				console.log(e.detail.page.id + ' beforeShow');
			});
			view.addEventListener('pageShow', function(e) {
				//				console.log(e.detail.page.id + ' show');
			});
			view.addEventListener('pageBeforeBack', function(e) {
				//				console.log(e.detail.page.id + ' beforeBack');
			});
			view.addEventListener('pageBack', function(e) {
				//				console.log(e.detail.page.id + ' back');
			});
		})(mui);
		// var title_right = $(".my_welfare_content1_additional_title_right").outerHeight();
		// 	$(".my_welfare_content1_additional_title_left").css("height",title_right);
		
	</script>
	</html>